<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8" />
		<style>
			#yuan{
				width:100px;
				height:50px;
				border-top:2px solid red;
				border-right:2px solid red;
				border-bottom:50px solid red;
				border-left:2px solid red;
				border-radius:100px;
				position:relative;/*设置为对象的参照物*/
			}
			
			#yuan::after{
				content:'';
				width:10px;
				height:10px;
				border:20px solid red;
				position:absolute;
				left:0px;
				top:25px;
				border-radius:50px;
				background:#fff; 	
			}
			#yuan::before{
				content:'';
				width:10px;
				height:10px;
				border:20px solid #FFF;
				position:absolute;
				right:0px;
				top:25px;
				border-radius:50px;
				background:red;
			
			}
		</style>
	</head>
	<body>
		<div id="yuan">
		</div>
	</body>
</html>